<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>边框练习</title>
		<!--1.画圆形
		    2.画正三角形
		思路1：  html   div元素
		         css    倒角，必须有边框
		思路2：  html   div元素#triangle
		         css    斜边
				        不设置宽高
						左边框：50像素实线红色  transparent
						右边框：50像素实线黄色  transparent
						下边框：50像素实线蓝色、透明度.3
						颜色值：rgba(0,0,225,.3)
		-->
	<style>
		/*1.画圆*/
		div#circle{
			width: 300px;
			height: 300px;
			border: 1px solid red;
			border-radius: 50%;
			/*边框阴影属性  box-shadow属性*/
			box-shadow: 5px 5px 5px 10px red inset;
		}
		/*2.正三角形*/
		div#triangle{
			width: 0;
			/*border-left: 50px solid transparent;
			border-right: 50px solid transparent;
			/*border-bottom: 50px solid rgba(0,0,225,.3);*/
			/*两行：全部设置成透明色，上面的三角设置颜色*/
			border: 50px solid transparent;
			border-left-color:rgba(0,0,225,.3) ;
		}
		input{
			outline: 1px solid red;
			outline: 0;/*去掉边框效果，通配选择器中*/
		}
	</style>
	</head>
	<body>
	   <div></div>
	   <div id="circle"></div>
	   <div id="triangle"></div>
	   文本框：<input type="text">
	</body>
</html>